<template>
  <div class="login">
    <group class="inputs">
      <x-input
      placeholder="名字"
      :show-clear="false"
      v-model="userName"
      placeholder-align="left"></x-input>
      <datetime
        v-model="borthDate"
        @on-change="change"
        title="出生日期"
        @on-cancel="log('cancel')"
        @on-confirm="onConfirm"
        @on-hide="log('hide', $event)"></datetime>
    </group>
    <x-button
    class="btn"
    @click.native="submit"
    type="primary">开始查询</x-button>
  </div>
</template>

<script>
import { Datetime, Group, XButton ,XInput} from "vux";

import { setTimeout } from "timers";
export default {
  name: "login",
  components: {
    Datetime,
    Group,
    XButton,
    XInput
  },
  data() {
    return {
     borthDate:'',
     userName
    };
  },
  created(){

  },
  methods: {
    submit() {
      if (this.userName == "" || this.borthDate == "") {
        this.$vux.toast.text("名字和出生日期不能为空");
        return;
      }
      this.$http
        .post("/queryConstellation", {
          userName: this.userName,
          birthday: this.borthDate
        })
        .then(data => {
          if(data.respCode==0){
            this.$vux.toast.text(data.respResult.constellationDescription);
          }else {
            e&&this.$vux.toast.text(e);
          }
          console.log(data)
        })
    },
    log (str1, str2 = '') {
      console.log(str1, str2)
    },
    change (value) {
      console.log('change', value)
    },
    onConfirm (val) {
      console.log('on-confirm arg', val)
      console.log('current value', this.borthDate)
    },
  },
};
</script>

<style scoped lang="less">
@import "./index.less";
</style>
